<!-- 
  vue3为何比vu2更快？
    1）proxy响应式
    2）PatchFlag
    3）hoistStatic
    4）cacheHandler
    5）SSR优化
    6）tree-shaking

------------------------------------
PatchFlag:
  模板编译时，动态节点做标记，标记分为不同的类型，如：
  diff算法时，根据标记来区分出是静态节点还是动态节点，以及是哪一种类型的动态节点。
    如：1 /* TEXT */
       2 /* CLASS */
       8 /* PROPS */, ["id"]
       3 /* TEXT, CLASS */

  不同的节点，就可以优化diff算法。

  把模板编译成js，https://vue-next-template-explorer.netlify.app/


------------------------------------
hoistStatic：  hoist是提升的意思
  将静态节点定义提升到父作用域，缓存起来。
  多个相邻的静态节点，会被合并起来。
  就是拿空间换时间的优化策略。


------------------------------------
cacheHandler：
  缓存事件

------------------------------------
SSR优化：
  静态节点直接输出，绕过了vdom。如果是动态节点，还是需要动态渲染的。

------------------------------------
tree-shaking：
  编译时，根据不同的情况，引入不同的api

------------------------------------
为什么vue3比vue2快？
答：1）proxy响应式
   2）vue3模板编译时，会给动态节点打标记，不同的动态节点会打上不同的标记。目的为了优化diff。
   3）hoistStatic，把静态节点提升，合并，缓存。以空间找时间的的优化策略。
   4）cacheHandler 缓存事件
   5）SSR  静态节点直接输出，绕过了vdom。如果是动态节点，还是需要动态渲染的。
   6）tree-shaking  按需引入
   ....

------------------------------------
 -->